<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    // 箭头函数 就是将普通函数的function省略，然后在代码块和()之间用一个=>代替
    // 箭头函数内部的this永远指向箭头函数声明时所在的对象
    // 普通函数内部的this指向指向调用函数的对象
    
    // function fn() {
    //   console.log(this) // window 因为我们这样声明的函数其实是在window对象上声明的
    // }
    // window.fn()
    // console.log(window)
    // setTimeout(() => {
    //   console.log(this)
    // })
    // let obj = {
    //   name: 'zhangsan',
    //   fun() {
    //     console.log(this)
    //   }
    // }
    // obj.fun()
    // let obj = {
    //   name: 'zhangsan',
    //   fun() {
    //     setTimeout(function() {
    //       console.log(this)
    //     })
    //   }
    // }
    // obj.fun()
    // let obj = {
    //   name: 'zhangsan',
    //   fun() {
    //     setTimeout(() => {
    //       console.log(this)
    //     })
    //   }
    // }
    // obj.fun()
    // =======================================
    // 1. 当函数只有一个参数 并且返回值就是这个参数的时候
    // function fn(a) {
    //   return {
    //     name: 'zhangsan'
    //   }
    // }
    // let num = fn(3)
    // console.log(num)
    // function fn(a) {

    // }
    // let num = fn(3)
    // console.log(num)
    // var arr = [1, 2, 3]
    // let num = arr.push(5)
    // console.log(num)
    // function fn(a) {
    //   return a
    // }
    // const fn = a => a
    // let num = fn(3)
    // console.log(num)
    // 2.当箭头函数有多个参数或者0个参数 并且返回值是一个简单的逻辑的时候 可以省略{}
    // function fn(a, b, c) {
    //   return a + b + c
    // }
    // const fn = (a, b, c) => a + b + c
    // let num = fn(1, 2, 3)
    // console.log(num)
    // function fn(a, b) {
    //   return a + b
    // }
    // const fn = (a, b) => a + b
    // fn(1, 2)
    // 3.箭头函数的第三种写法 当箭头函数返回一个对象的时候
    // function fn() {
    //   return {
    //     name: 'zhangsan',
    //     age: 12
    //   }
    // }
    // const fn = () => {
    //   return {
    //     name: 'zhangsan',
    //     age: 12
    //   }
    // }
    const fn = () => ({name:'zhangsan', age: 12})
    // let obj = fn()
    // console.log(obj)
    // 4.箭头函数的完整写法
    const fn = (a) => {
      a++
      a++
      return a
    }
    fn(3)
  </script>
</body>
</html>